//配置路由的地方
import Vue from 'vue'
import VueRouter from 'vue-router'
//使用插件
Vue.use(VueRouter)
// 引入路由组件
const Home = () => import('@/views/Home')
const Login = () => import('@/views/Login')
const Search = () => import('@/views/Search')
const Register = () => import('@/views/Register')
//先把VueRouter原型对象的push保存一份
let originPush = VueRouter.prototype.push
let originReplace = VueRouter.prototype.replace
//重写push|replace
//第一个参数：告诉原来的push方法，你往哪里跳转（传递哪些参数）
VueRouter.prototype.push = function (location, resolve, reject) {
  if (resolve && reject) {
    //apply和call的区别： 相同点：都可以调用函数一次，都可以修改函数的上下文一次
    //不同点：call与apply传递参数：call传递参数用逗号隔开，apply方法传递数组
    originPush.call(this, location, resolve, reject) // 调用函数，并将this指向VueRouter
  } else {
    originPush.call(this, location, () => {}, () => {})
  }
}
VueRouter.prototype.replace = function (location, resolve, reject) {
  if (resolve && reject) {
    //apply和call的区别： 相同点：都可以调用函数一次，都可以修改函数的上下文一次
    //不同点：call与apply传递参数：call传递参数用逗号隔开，apply方法传递数组
    originReplace.call(this, location, resolve, reject) // 调用函数，并将this指向VueRouter
  } else {
    originReplace.call(this, location, () => {}, () => {})
  }
}
const routes = [
  {
    path: '/home',
    component: Home,
    meta: {show: true},
    name: 'home'
  },
  {
    path: '/login',
    component: Login,
    meta: {show: false},
    name: 'login'
  },
  {
    path: '/search/:keyword?', // 指定params参数可传可不传
    component: Search,
    meta: {show: true},
    name: 'search',
    // 路由组件能不能传递props数据？ 可以
    // 下面这种写法只能传递params参数
    //props: true
    //对象写法: 额外给路由组件传递一些props
    //props: {a:1, b:2}
    //常用写法：函数写法: 可以把params参数、query参数，通过props传递给路由组件
    //props: ($route) => ({keyword: $route.params.keyword, k: $route.query.k})
  },
  {
    path: '/register',
    component: Register,
    meta: {show: false},
    name: 'register'
  },
  {
    //重定向，在项目跑起来的时候，访问 / ,立马让他定向到首页
    path: '/',
    redirect: '/home'
  }
]

const router = new VueRouter({
  routes
})

export default router
